<template>
  <el-select
    v-model="value"
    filterable
    remote
    reserve-keyword
    placeholder="请输入项目名称"
    :remote-method="remoteMethod"
    @change = 'changeData'
  >
    <el-option
      v-for="item in options"
      :key="item.id"
      :label="item.projectName"
      :value="item.id"
    />
  </el-select>
</template>

<script setup >
import { ref } from 'vue'
import { projectBaseSelectByName } from '../../utils/api'
const emits = defineEmits(['update:projectNameCode'])
const props = defineProps(['projectNameCode'])
const options = ref([])
const value = ref('')
const remoteMethod = (query) => {
  if (query) {
    // 后端请求数据 
    projectBaseSelectByName({
      projectName:query
    }).then(resp => {
      if(resp.code == 200) options.value = resp.data
    })
  } else {
    options.value = []
  }
}
const changeData = (code) => { 
  emits('update:projectNameCode', code)
}

</script>
<style scoped>

</style>